<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>我的优惠券</title>
<link rel="stylesheet" type="text/css" href="css/lib/swiper.min.css"/>
<link rel="stylesheet" type="text/css" href="css/lib/doumee.css"/>
<link rel="stylesheet" type="text/css" href="css/public.css"/>
<link rel="stylesheet" type="text/css" href="css/lib/dialog.css"/>
<link rel="stylesheet" type="text/css" href="css/weal.css"/>
<link rel="stylesheet" type="text/css" href="css/order.css"/>
<script src="js/lib/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lib/swiper.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lib/doumee.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lib/vue-2.5.17.js" type="text/javascript" charset="utf-8"></script>
<script src="js/data.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lib/dialog.js" type="text/javascript" charset="utf-8"></script>
<script src="js/order.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>

<header class="header flex-row tc bottom-line main-line" id="orderNav">
	<a class="flex-full" href="personal_order.html">商城订单</a>
	<a class="flex-full" href="personal_order.html?type=4">定制家居</a>
</header>
<nav class="bottom-line tc h5 flex-row" id="wealTab">
	<a class="flex-full">全部</a>
	<a class="flex-full">待付款</a>
	<a class="flex-full">已付款</a>
	<a class="flex-full">已完成</a>
</nav>

<div class="swiper-container Main" id="Main">
	<div class="swiper-wrapper">
		<div class="swiper-slide content">
			
			<div class="children" id="orderMod">
				<div id="order-mall" v-if="orderStatu">
					<!--已付款-->
					<ul class="order-box bg-w">
						<li class="top bottom-line">
							<h5 class="type dm-left">门店自提</h5>
							<h5 class="statu dm-right">已付款</h5>
						</li>
						<li class="wrap dm-clearfix" onclick="location.href='orderDetail.html'">
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
								<span class="num flex-row">+2</span>
							</div>
						</li>
						<li class="top-line info tr">共计6件商品 合计: <span class="red">￥2400.00</span></li>
						<li class="bot top-line flex-row">
							<div class="txt flex-full">前往志邦厨柜（美多店）自提商品</div>
							<div class="btn-box flex-row">
								<a class="btn" onclick="showCode()">核销二维码</a>
							</div>
						</li>
					</ul>
					
					<!--已完成-->
					<ul class="order-box bg-w">
						<li class="top bottom-line">
							<h5 class="type dm-left">门店自提</h5>
							<h5 class="statu dm-right">已完成</h5>
						</li>
						<li class="wrap dm-clearfix" onclick="location.href='orderDetail.html'">
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
								<span class="num flex-row">+2</span>
							</div>
						</li>
						<li class="top-line info tr">共计6件商品 合计: <span class="red">￥2400.00</span></li>
						<li class="bot top-line flex-row">
							<div class="txt flex-full">您已于2018.10.20 12:23:34 在志邦厨柜(美多店)自提商品
	核销人：刘慧娟</div>
						</li>
					</ul>
					
					<!--待付款-->
					<ul class="order-box bg-w">
						<li class="top bottom-line">
							<h5 class="type dm-left">快递到家</h5>
							<h5 class="statu dm-right red">待付款</h5>
						</li>
						<li class="wrap dm-clearfix" onclick="location.href='orderDetail.html'">
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
								<span class="num flex-row">+2</span>
							</div>
						</li>
						<li class="top-line info tr">共计6件商品 合计: <span class="red">￥2400.00</span></li>
						<li class="bot top-line flex-row">
							<div class="txt flex-full"></div>
							<div class="btn-box flex-row">
								<a class="btn">立即支付</a>
							</div>
						</li>
					</ul>
					
					<!--交易关闭-->
					<ul class="order-box bg-w">
						<li class="top bottom-line">
							<h5 class="type dm-left">快递到家</h5>
							<h5 class="statu dm-right">交易关闭</h5>
						</li>
						<li class="wrap dm-clearfix" onclick="location.href='orderDetail.html'">
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
								<span class="num flex-row">+2</span>
							</div>
						</li>
						<li class="top-line info tr">共计6件商品 合计: <span class="red">￥2400.00</span></li>
						<li class="bot top-line flex-row">
							<div class="txt flex-full"></div>
							<div class="btn-box flex-row">
								<a class="btn">删除订单</a>
							</div>
						</li>
					</ul>
					
					<!--已付款-快递-->
					<ul class="order-box bg-w">
						<li class="top bottom-line">
							<h5 class="type dm-left">快递到家</h5>
							<h5 class="statu dm-right">已付款</h5>
						</li>
						<li class="wrap dm-clearfix" onclick="location.href='orderDetail.html'">
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
								<span class="num flex-row">+2</span>
							</div>
						</li>
						<li class="top-line info tr">共计6件商品 合计: <span class="red">￥2400.00</span></li>
						<li class="bot top-line flex-row">
							<div class="txt flex-full"></div>
							<div class="btn-box flex-row">
								<a class="btn">查看物流</a>
								<a class="btn" onclick="receipt()">确认收货</a>
							</div>
						</li>
					</ul>
					
					<!--已完成-快递-->
					<ul class="order-box bg-w">
						<li class="top bottom-line">
							<h5 class="type dm-left">快递到家</h5>
							<h5 class="statu dm-right">已完成</h5>
						</li>
						<li class="wrap dm-clearfix" onclick="location.href='orderDetail.html'">
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
							</div>
							<div class="pt cover" data-rate='1'>
								<img src="image/test/pro-1.png" />
								<span class="num flex-row">+2</span>
							</div>
						</li>
						<li class="top-line info tr">共计6件商品 合计: <span class="red">￥2400.00</span></li>
						<li class="bot top-line flex-row">
							<div class="txt flex-full">完成于2018.10.20 12:23:34</div>
						</li>
					</ul>
				
				</div>
				
				<div id="order-home" v-else>
					
					<ul class="home-list bg-w">
						<li class="home-top dm-clearfix">
							<h5 class="type dm-left">定制家居</h5>
							<h6 class="time dm-right">2018-10-10 15:12:34</h6>
						</li>
						<li class="home-center flex-row top-line">
							<div class="photo bg-g cover">
								<img src="image/home/03.jpg" />
							</div>
							<div class="flex-full">
								<h4 class="name-box">
									<span class="name">厨柜</span>
									<span class="h5">欧式简约</span>
								</h4>
								<h6 class="addr">订购门店：合肥环湖家具城门店(王建国)</h6>
							</div>
						</li>
						<li class="btn-box top-line dm-clearfix">
							<button class="btn dm-right" type="button" onclick="skipHomeDtl()">查看详情</button>
						</li>
					</ul>
					
					<ul class="home-list bg-w">
						<li class="home-top dm-clearfix">
							<h5 class="type dm-left">定制家居</h5>
							<h6 class="time dm-right">2018-10-10 15:12:34</h6>
						</li>
						<li class="home-center flex-row top-line">
							<div class="photo bg-g cover">
								<img src="image/home/03.jpg" />
							</div>
							<div class="flex-full">
								<h4 class="name-box">
									<span class="name">衣柜</span>
									<span class="h5">欧式简约</span>
								</h4>
								<h6 class="addr">订购门店：合肥环湖家具城门店(王建国)</h6>
							</div>
						</li>
						<li class="btn-box top-line dm-clearfix">
							<button class="btn dm-right" type="button" onclick="skipHomeDtl()">查看详情</button>
						</li>
					</ul>
					
					<ul class="home-list bg-w">
						<li class="home-top dm-clearfix">
							<h5 class="type dm-left">定制家居</h5>
							<h6 class="time dm-right">2018-10-10 15:12:34</h6>
						</li>
						<li class="home-center flex-row top-line">
							<div class="photo bg-g cover">
								<img src="image/home/03.jpg" />
							</div>
							<div class="flex-full">
								<h4 class="name-box">
									<span class="name">厨柜</span>
									<span class="h5">欧式简约</span>
								</h4>
								<h6 class="addr">订购门店：合肥环湖家具城门店(王建国)</h6>
							</div>
						</li>
						<li class="btn-box top-line dm-clearfix">
							<button class="btn dm-right" type="button" onclick="skipHomeDtl()">查看详情</button>
						</li>
					</ul>
					
					<ul class="home-list bg-w">
						<li class="home-top dm-clearfix">
							<h5 class="type dm-left">定制家居</h5>
							<h6 class="time dm-right">2018-10-10 15:12:34</h6>
						</li>
						<li class="home-center flex-row top-line">
							<div class="photo bg-g cover">
								<img src="image/home/03.jpg" />
							</div>
							<div class="flex-full">
								<h4 class="name-box">
									<span class="name">衣柜</span>
									<span class="h5">欧式简约</span>
								</h4>
								<h6 class="addr">订购门店：合肥环湖家具城门店(王建国)</h6>
							</div>
						</li>
						<li class="btn-box top-line dm-clearfix">
							<button class="btn dm-right" type="button" onclick="skipHomeDtl()">查看详情</button>
						</li>
					</ul>
					
					<ul class="home-list bg-w">
						<li class="home-top dm-clearfix">
							<h5 class="type dm-left">定制家居</h5>
							<h6 class="time dm-right">2018-10-10 15:12:34</h6>
						</li>
						<li class="home-center flex-row top-line">
							<div class="photo bg-g cover">
								<img src="image/home/03.jpg" />
							</div>
							<div class="flex-full">
								<h4 class="name-box">
									<span class="name">厨柜</span>
									<span class="h5">欧式简约</span>
								</h4>
								<h6 class="addr">订购门店：合肥环湖家具城门店(王建国)</h6>
							</div>
						</li>
						<li class="btn-box top-line dm-clearfix">
							<button class="btn dm-right" type="button" onclick="skipHomeDtl()">查看详情</button>
						</li>
					</ul>
					
				</div>
				
			</div>
			
		</div>
	</div>
</div>

<script type="text/javascript">

//订单状态切换
$("#wealTab").on('click','a',function(){
	var index = $(this).index();
	location.replace('personal_order.html?type='+index);
});

//显示核销二维码
function showCode(){
	$('body').append(`
		<div id="codeMask">
			<div class="mask"></div>
			<div class="code-box flex-col">
				<h4 class="bt">核销二维码</h4>
				<img src="image/test/code.jpg" />
			</div>
		</div>
	`);
	$("#codeMask").click(function(){
		$("#codeMask").fadeOut(function(){
			$("#codeMask").remove();
		});
	});
};

//确认收货
function receipt(){
	dmAlert('确认已收到货？',{
		success:function(){
			tip('收货成功');
		}
	});
};

//进入订单详情
function skipHomeDtl(){
	location.href="homeDtl.html?id="+Math.random();
};

</script>

</body>
</html>
